<template>
	<view class="page" :style="loading ? 'opacity: 0;' : 'opacity: 1;'">
		<!--  v-model="dataList" @query="queryList" -->
		<pageTxt>
			<z-paging ref="paging" :paging-style="{ 'background-color': '#f7f7f7', height: '100%', width: '100%' }">
				<!-- 头部 -->
				<template slot="top">
					<view class="navbar-box">
						<u-navbar title="新增增减项" :autoBack="true" :fixed="false"></u-navbar>
					</view>
				</template>
				<view class="add-content ios">
					<u--form labelPosition="top" :model="formData" ref="uForm" labelWidth="auto">
						<view class="form-box">
							<u-form-item labelPosition="top" labelWidth="100%" required label="增减项类型" borderBottom>
								<u-radio-group v-model="formData.increase_or_decrease" placement="row">
									<u-radio label="增项" :name="1"></u-radio>
									<u-radio label="减项" :name="2"></u-radio>
								</u-radio-group>
							</u-form-item>

							<u-form-item labelPosition="top" labelWidth="100%" required label="项目名称" borderBottom @click="showSelect('projectListShow')">
								<u-input
									:value="formData.project_item.project_name"
									disabled
									disabledColor="#ffffff"
									placeholder="请选择项目名称"
									border="none"
									suffixIcon="arrow-right"
								></u-input>
							</u-form-item>

							<u-form-item labelPosition="top" labelWidth="100%" required label="增减内容" borderBottom @click="showSelect('contentListShow')">
								<u-input
									:value="formData.change_content_item.name"
									disabled
									disabledColor="#ffffff"
									placeholder="请选择增减内容"
									border="none"
									suffixIcon="arrow-right"
								></u-input>
							</u-form-item>

							<u-form-item labelPosition="top" labelWidth="100%" required label="增减项原因" borderBottom>
								<u--textarea
									disableDefaultPadding
									v-model="formData.reason_type"
									border="none"
									placeholder="请输入增减项原因"
									:placeholderStyle="{ fontSize: '13.5px', color: '#BFC4CC' }"
								></u--textarea>
							</u-form-item>

							<u-form-item labelPosition="top" labelWidth="100%" required label="施工内容" borderBottom>
								<u--textarea
									disableDefaultPadding
									v-model="formData.construction_content"
									border="none"
									placeholder="请输入施工内容"
									:placeholderStyle="{ fontSize: '13.5px', color: '#BFC4CC' }"
								></u--textarea>
							</u-form-item>

							<u-form-item labelPosition="top" labelWidth="100%" label="备注" borderBottom>
								<u--textarea
									disableDefaultPadding
									v-model="formData.remark"
									border="none"
									placeholder="请输入备注"
									:placeholderStyle="{ fontSize: '13.5px', color: '#BFC4CC' }"
								></u--textarea>
							</u-form-item>

							<u-form-item labelPosition="top" labelWidth="100%" required label="附件">
								<file-upload @afterRead="afterRead" @delete="deletePic"></file-upload>
							</u-form-item>
						</view>
					</u--form>
				</view>
				<view class="footer ios">
					<u-button
						text="提交"
						@click="submit"
						customStyle="width: 702rpx;height: 88rpx;background: #3B75FF;border-radius: 16rpx;font-weight: 500;font-size: 28rpx;color: #FFFFFF;margin:20rpx 24rpx;"
					></u-button>
				</view>
			</z-paging>
		</pageTxt>

		<!-- 项目列表 -->
		<u-picker
			:show="projectListShow"
			:columns="projectList"
			keyName="project_name"
			@confirm="confirm($event, 'project_item')"
			closeOnClickOverlay
			@close="close"
			@cancel="close"
			confirmColor="#3B75FF"
		></u-picker>
		<!-- 增减内容 -->
		<u-picker
			:show="contentListShow"
			:columns="contentList"
			keyName="name"
			@confirm="confirm($event, 'change_content_item')"
			closeOnClickOverlay
			@close="close"
			@cancel="close"
			confirmColor="#3B75FF"
		></u-picker>
	</view>
</template>

<script>
export default {
	data() {
		return {
			loading: false,
			list: [],
			formData: {
				increase_or_decrease: 1,
				project_item: '',
				change_content_item: '',
				reason_type: '',
				construction_content: '',
				remark: '',
				file_list: []
			},

			// 相关数据
			projectList: [],
			projectListShow: false,
			contentList: [],
			contentListShow: false
		};
	},
	onLoad() {
		this.getList();
	},
	methods: {
		showSelect(type) {
			this[type] = true;
		},
		close() {
			this.projectListShow = false;
			this.contentListShow = false;
		},
		confirm(e, type) {
			console.log(e, type, 'confirm');
			this.formData[type] = e.value[0];
			this.close();
		},

		afterRead(files) {
			files.map((item) => {
				let obj = {
					url: item.url
				};
				this.formData.file_list.push(obj);
				console.log(this.formData.file_list, 'afterRead');
			});
		},
		deletePic(e) {
			console.log(e, 'deletePic');
			this.formData.file_list.splice(e.index, 1);
		},
		async submit() {
			let formData = this.formData;
			console.log(formData, 'sss');
			if (!formData.project_item) {
				this.$refs.uToast.show({
					message: '请选择售后项目'
				});
				return;
			}
			if (!formData.change_content_item) {
				this.$refs.uToast.show({
					message: '请选择增减内容'
				});
				return;
			}
			if (!formData.reason_type) {
				this.$refs.uToast.show({
					message: '请输入增减项原因'
				});
				return;
			}
			if (!formData.construction_content) {
				this.$refs.uToast.show({
					message: '请输入施工内容'
				});
				return;
			}
			if (formData.file_list.length == 0) {
				this.$refs.uToast.show({
					message: '请上传附件'
				});
				return;
			}

			uni.showLoading({
				mask: true
			});

			let resImg = await this.$upload(formData.file_list);

			let res = await this.$hApi.applyChangeItems({
				project_id: formData.project_item.id,
				increase_or_decrease: formData.increase_or_decrease,
				reason_type: formData.reason_type,
				change_content: formData.change_content_item.name,
				change_content_id: formData.change_content_item.id,
				construction_content: formData.construction_content,
				remark: formData.remark,
				change_items_file: resImg.arrResult
			});

			uni.hideLoading();
			if (res.code == 200) {
				var pages = getCurrentPages();
				var perPage = pages[pages.length - 2];
				if (perPage && perPage.$vm.$refs.idi) {
					perPage.$vm.$refs.idi.searchFunc();
				}

				setTimeout(() => {
					var currentPages = getCurrentPages()[getCurrentPages().length - 2]
					if (currentPages) {
						uni.navigateBack({
							delta: 1
						});
					} else {
						uni.reLaunch({
							url: '/pages/index/index'
						});
					}
				}, 500);
			}
			uni.showToast({
				title: res.code == 200 ? '操作成功' : res.message,
				icon: res.code == 200 ? 'success' : 'error'
			});
		},

		// 获取数据
		getList() {
			this.$hApi.allowAssociatedProjects({}).then((res) => {
				console.log(res, '获取项目列表');
				if (res.code == 200) {
					this.projectList = [res.data];
				}
			});
			this.$hApi
				.getChangeContent({
					page: 1,
					num: 999
				})
				.then((res) => {
					console.log(res, '获取增减内容');
					if (res.code == 200) {
						this.contentList = [res.data.list];
					}
				});
		}
	}
};
</script>

<style lang="scss" scoped></style>
